<header class="c-layout-header c-layout-header-default c-layout-header-dark-mobile c-header-transparent-dark" data-minimize-offset="80">
    <div class="c-navbar">
        <div class="container-fluid">
            <!-- BEGIN: BRAND -->
            <div class="c-navbar-wrapper clearfix">
                <div class="c-brand c-pull-left">
                    <f:link.page pageUid="{rootPage}" class="c-logo">
                        <img src="{f:uri.image(src: logoFile, maxHeight: 40)}" alt="{siteTitle}" title="{siteTitle}" class="c-desktop-logo"/>
                        <img src="{f:uri.image(src: logoFile, maxHeight: 40)}" alt="{siteTitle}" title="{siteTitle}" class="c-desktop-logo-inverse"/>
                        <img src="{f:uri.image(src: logoFile, maxHeight: 30)}" alt="{siteTitle}" title="{siteTitle}" class="c-mobile-logo"/>
                    </f:link.page>
                    <button class="c-hor-nav-toggler" type="button" data-target=".c-mega-menu">
                        <span class="c-line"></span>
                        <span class="c-line"></span>
                        <span class="c-line"></span>
                    </button>
                    <button class="c-topbar-toggler" type="button">
                        <i class="fa fa-ellipsis-v"></i>
                    </button>
                    <button class="c-search-toggler" type="button">
                        <i class="fa fa-search"></i>
                    </button>
                </div>
                <!-- END: BRAND -->
                <!-- BEGIN: QUICK SEARCH -->
                <form class="c-quick-search" action="<f:uri.page pageUid='search' />" method="post">
                    <input type="hidden" name="tx_indexedsearch[_sections]" value="0">
                    <input type="hidden" name="tx_indexedsearch[_freeIndexUid]" value="_">
                    <input type="hidden" name="tx_indexedsearch[pointer]" value="0">
                    <input type="hidden" name="tx_indexedsearch[ext]" value="">
                    <input type="hidden" name="tx_indexedsearch[type]" value="1">
                    <input type="hidden" name="tx_indexedsearch[defOp]" value="0">
                    <input type="hidden" name="tx_indexedsearch[media]" value="-1">
                    <input type="hidden" name="tx_indexedsearch[order]" value="rank_flag">
                    <input type="hidden" name="tx_indexedsearch[group]" value="flat">
                    <input type="hidden" name="tx_indexedsearch[lang]" value="{sys_language_uid}">
                    <input type="hidden" name="tx_indexedsearch[desc]" value="0">
                    <input type="hidden" name="tx_indexedsearch[results]" value="5">
                    <input type="text" name="tx_indexedsearch[sword]" value="{searchKeyword}" placeholder="{f:translate(key:'LLL:fileadmin/templates/v2/private/language/locallang.xml:searchPlaceholder')}" class="form-control" autocomplete="off"/>
                    <span class="c-theme-link">&times;</span>
                </form>
                <!-- END: QUICK SEARCH -->
                <!-- BEGIN: HOR NAV -->
                <!-- BEGIN: LAYOUT/HEADERS/MEGA-MENU -->
                <!-- BEGIN: MEGA MENU -->
                <!-- Dropdown menu toggle on mobile: c-toggler class can be applied to the link arrow or link itself depending on toggle mode -->
                <nav class="c-mega-menu c-pull-right c-mega-menu-dark c-mega-menu-dark-mobile c-fonts-uppercase c-fonts-bold">
                    <ul class="nav navbar-nav c-theme-nav">
                        <f:cObject typoscriptObjectPath="lib.navigation.main"/>
                        <li class="c-search-toggler-wrapper">
                            <a href="#" class="c-btn-icon c-search-toggler">
                                <i class="fa fa-search"></i>
                            </a>
                        </li>
                    </ul>
                </nav>
                <div style="display: none;">
                    <f:cObject typoscriptObjectPath="lib.language"/>
                </div>
                <!-- END: MEGA MENU -->
                <!-- END: LAYOUT/HEADERS/MEGA-MENU -->
                <!-- END: HOR NAV -->
            </div>
        </div>
    </div>
</header>